<template>
  <div id="incident-list">
    <ul class="jsd-card-list" v-infinite-scroll="getIncident" infinite-scroll-disabled="busy"
        infinite-scroll-distance="30">
      <li is="card" v-for="item of incidentInfo">
        <div class="jsd-card-title" slot="card-title">
          <time>{{item.accidentDate | formatDate}}</time>
          <span>KPI扣分：<strong>{{item.points}}</strong></span>
        </div>
        <ul class="jsd-card-body" slot="card-content">
          <li v-if="item.responsibility">
            <strong>责任：</strong>
            <span>{{item.responsibility}}</span>
          </li>
         <!--  <li v-if="item.illegalLevel">
           <strong>违规类型：</strong>
           <span>{{item.illegalLevel}}</span>
         </li> -->
          <li v-if="item.accidentType">
            <strong>事故类型：</strong>
            <span>{{item.accidentType}}</span>
          </li>
          <li v-if="item.bpType">
            <strong>BP事故分类：</strong>
            <span>{{item.bpType}}</span>
          </li>
        </ul>
      </li>
    </ul>
    <!--正在加载提示框-->
    <div is="loading" v-if="loadShow"></div>
    <!--加载失败弹框-->
    <div is="dialog-box" :message="dialogMessage" v-if="dialogShow" @close-dialog="closeDialog" @cancle-dialog="closeDialog"></div>
    <li class="no_data" v-if="!incidentInfo.length">
      <i class="ion ion-ios-paper-outline"></i>
      <p>暂无数据
      </p>
    </li>
  </div>
</template>
<script type="text/javascript">
  import '../../assets/css/incident_record.scss';
  import interfaceAPI from '../../assets/js/insterface.js';
  import http from '../../assets/js/http_mixin'
  import card from '../../widget/card.vue'
  var incidentRecordUrl = interfaceAPI.incidentRecordUrl;
  export default{
    data(){
      return {
        pageTotle: '',             // 页面总数
        count: 0,                  // 计数，记录当前页面的值
        busy: false,
        incidentInfo: []              // 事故信息
      }
    },
    mixins: [http],
    components: {
      card
    },
    methods: {
      getIncident(){
        this.getInfo({
          url: incidentRecordUrl,
          param: {
            'num': this.$route.query.empNo,
            'currentPage': this.count,
            'pageSize': '10'
          },
          success: function (response) {
            console.log(response);
              var responseData = response.body.data;
              this.pageTotle = response.body.pages;
              if (this.pageTotle > this.count) {
                if (responseData.length > 0) {
                  for (var i = 0; i < responseData.length; i++) {
                    this.incidentInfo.push(responseData[i]);
                  }
                }
                this.count++;
              }
              this.busy = false;
              return false;
          },
          fail: function (response) {
            this.dialogMessage = '请求失败，请稍后再试';
            this.dialogShow = true;
          }
        })
      }
    },
    mounted(){
      document.title = '事故记录';
    }

  }
</script>
